<template>
  <div id="app-container">
    <div class="nav-list">
      <ul>
        <li>
          <nuxt-link to="/">首页</nuxt-link>
        </li>
        <li>
          <nuxt-link to="/news">新闻</nuxt-link>
        </li>
        <li>
          <nuxt-link to="/about">我们</nuxt-link>
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
  export default {
    name: "Nav",
    // 动态数据集合
    data() {
      return {}
    },
    // 计算属性
    computed: {},
    // 监听器
    watch: {},
    // 页面组件渲染完成钩子
    mounted() {
    },
    // 方法集合
    methods: {}
  }
</script>

<style scoped lang="scss">
  #app-container {
    .nav-list {
      ul {
        list-style: none;
        display: flex;
        justify-content: flex-end;
        padding-right: 20px;

        li {
          padding: 0 10px;
          cursor: pointer;
        }
      }
    }
  }
</style>
